<template>
	<view class="notice">
		<view class="left" v-if="l_type" @click="l_event">
			<my-icons :type="l_type" :size="l_size" :color="l_color"></my-icons>
			
		</view>
		<slot></slot>
		<view class="right" v-if="r_type" @click="r_event">
			<my-icons :type="r_type" :size="r_size" :color="r_color"></my-icons>
		</view>
	</view>
</template>

<script>
export default {
	name: 'myNotice',
	props:{
		l_type:{
			type:String,
			default:'pub'
		},
		r_type:{
			type:String,
			default:'error'
		},
		l_size:{
			type:Number,
			default:36
		},
		r_size:{
			type:Number,
			default:36
		},
		l_color:{
			type: String,
			default: '#999'
		},
		r_color:{
			type: String,
			default: '#999'
		}
	},
	methods:{
		l_event() {
			this.$emit('l_event')
		},
		r_event() {
			this.$emit('r_event')
		}
	}
}
</script>

<style lang="less" scoped>
	.notice{
		box-sizing: border-box;
		line-height: 2em;
		padding:0 15rpx;
		width:100%;
		justify-content: flex-start;
		background-color: #fffbe8;
		font-size:24rpx;
	}
</style>